<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4"
	layout:decorator="option/base_page">
<head>
	<meta charset="UTF-8" />
	<title>无线微功耗气体检测报警系统</title>
	<link rel="stylesheet" th:href="@{/lib/bootstrap-table/bootstrap-table.min.css}">
	<script th:src="@{/lib/bootstrap-table/bootstrap-table.min.js}"></script>
	<script th:src="@{/lib/bootstrap-table/bootstrap-table-locale-all.min.js}"></script>
	<link rel="stylesheet" th:href="@{/lib/bootstrapvalidator/css/bootstrapValidator.min.css}">
	<script th:src="@{/lib/bootstrap-treeview/bootstrap-treeview.min.js}"></script>
	<link rel="stylesheet" th:href="@{/lib/bootstrap-treeview/bootstrap-treeview.min.css}">
	<script th:src="@{/lib/bootstrapvalidator/js/bootstrapValidator.min.js}"></script>
	<script type="text/javascript" th:src="@{/js/option/auth/role.js}"></script>
</head>
<body layout:fragment="option-main">
	<h3>角色管理</h3>
	<div id="user-register-table-toolbar" class="clearfix">
		<div class="pull-left col-lg-3 input-group">
		      <input type="text" class="form-control" id="inputkeyword" placeholder="请输入关键字">
		      <span class="input-group-btn">
		        <button id="search-button" class="btn btn-default" type="button" >查询</button>
		      </span>
		 </div>
	   	<!-- <div class="pull-right">
	      	<button id="option-user-add-button" class="btn btn-default" type="button" data-toggle="modal" onclick="add()">添加角色</button>
	   	</div> -->
	</div>
	<table id="option-user-table" data-toolbar="#user-register-table-toolbar"></table>
	<!-- 新增模态框（Modal） -->
	<form method="post" action="" class="form-horizontal" role="form" id="form_data" style="margin: 20px;">
		<div class="modal fade" id="addRoleModal" tabindex="-1" data-backdrop="static"、role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
						<h4 class="modal-title" id="myModalLabel">
							添加角色
						</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal" role="form" >
						
						  <input type="hidden" class="form-control"  name="id" id="id">
						  <div class="form-group">
						    <label for="username" class="col-sm-2 control-label">角色名称</label>
						    <div class="col-sm-9">
						      <input type="text" class="form-control" id="name" name="name" placeholder="请输入角色名">
						    </div>
						  </div>
						 
						  <div class="form-group">
						    <label for="desc" class="col-sm-2 control-label">备注</label>
						    <div class="col-sm-9">
    							<textarea class="form-control" rows="3" name="desc" id="desc"></textarea>
    						</div>
						  </div>
						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭
						</button>
						<button  type="button" class="btn btn-primary" onclick="save()">
							保存
						</button>
					</div>
				</div>
			</div>
		</div>
	</form>
	<!-- 设置权限模态框 -->
	<div class="modal fade" id="authorizeModal" tabindex="-1" data-backdrop="static"、role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
							&times;
						</button>
						<h4 class="modal-title">
							设置权限
						</h4>
					</div>
					<div class="modal-body">
						<form class="form-horizontal" role="form">
						  <input type="hidden" class="form-control"  name="roleId" id="roleId">
						  <div class="form-group">
						    <label for="username" class="col-sm-2 control-label">角色名称</label>
						    <div class="col-sm-9">
						      <input type="text" class="form-control" id="roleName" name="roleName" readonly="readonly">
						    </div>
						  </div>
						 
						  <div class="form-group">
						    <label for="desc" class="col-sm-2 control-label">权限</label>
						    <div class="col-sm-9">
    							<div id="permissionTree"></div>
    						</div>
						  </div>
						</form>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭
						</button>
						<button  type="button" class="btn btn-primary" onclick="savePer()">
							保存
						</button>
					</div>
				</div>
			</div>
	</div>
	<!-- 模态框   信息删除确认 -->
    <div class="modal fade" id="delModal">
        <div class="modal-dialog">
            <div class="modal-content message_align">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"
                        aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title">提示</h4>
                </div>
                <div class="modal-body">
                    <!-- 隐藏需要删除的id -->
                    <input type="hidden" id="deleteHaulId" />
                    <p id="deleteHint">您确认要删除该条信息吗？</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default"
                        data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary"
                        id="deleteHaulBtn" onclick="confirmDel()">确认</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
     </div>
</body>
</html>